<#import "PageTemplate.ftl" as p> 

<@p.page>
<div class="page-header">
	<h1>Create and Run Job</h1>
</div>
<p class="lead">Please input all the data required to create and run a Job.</class>

<div class="input-group">
	<span class="input-group-addon">Template: </span>
	<select id="template" class="form-control">
	<#list templateList as template>
	<option value="${template}">${template}</option>
	</#list>
	</select>
</div>
<br />
<p><button id="createAndRunButton" class="btn btn-lg btn-primary btn-block" type="submit">Create and Run Job</button></p>

<script>
$(document).ready(function() {
	
	$('#createAndRunButton').click(function(event) {
		event.preventDefault();
		$('.alert-error').hide();
		$('#progress').show();
		
		var data = { 
			template: $('#template').val()
		}
		
		$.ajax({
            url: '/api/jobFromTemplate',
            type:'POST',
            accepts : "application/json",
    		contentType : "application/json",
    		processData : false,
    		dataType : "text",
            data: JSON.stringify(data),
            success: function (data) {
            	window.location.href="/job";// + data;
            },
            error: function(data) {
            	var msg = "Server error " + data.status + ". Please try again later.";
            	if(data.status == 400)
            		msg = "Invalid input data.";
            	
            	$('#progress').hide();
            	 $('.alert-error').text(msg).show();
            }
        });
		
	});
});
</script>
</@p.page>